<template>
    <el-menu active-text-color="#ffd04b" background-color="#545c64" class="el-menu-vertical-demo" @select="selectMenu"
        default-active="2" text-color="#fff">
        <el-sub-menu index="1">
            <template #title>
                <span>系统管理</span>
            </template>
            <el-menu-item index="/home/user">用户管理</el-menu-item>
            <el-menu-item index="/home/menu">菜单管理</el-menu-item>
            <el-menu-item index="/home/role">角色管理</el-menu-item>
        </el-sub-menu>


        <el-sub-menu index="2">
            <template #title>
                <span>Pinia</span>
            </template>
            <el-menu-item index="/home/pinia">Pinia框架</el-menu-item>

        </el-sub-menu>
    </el-menu>
</template>

<script setup lang="ts" name='SysMenu'>
import { ref, reactive } from "vue";
import { useRouter } from 'vue-router'

//获取Router对象

const router = useRouter();

function selectMenu(url: string) {
    console.log("url", url);
    router.push(url)

}

</script>

<style scoped></style>